doctype
html(ng-app='app')
  head
    meta(charset='utf-8')
    meta(name="viewport", content="width=device-width, initial-scale=1.0")

    if env == 'prod'
      title Angular-xeditable :: Edit in place for AngularJS
      include scripts-prod.jade
    else
      title Dev
      include scripts-dev.jade

  body(data-spy="scroll", data-target=".sidebar")
    include navbar.jade

    .container
      .row
        .col-sm-3.col-xs-12
          .well.sidebar
            ul.nav
              each g in structure
                if (!g.env || g.env === env)
                  li
                    a(href="#"+(g.anchor || g.id))= g.text
                    ul.nav
                      each item in g.items
                        li: a(href="#"+(item.anchor || item.id))= item.menutext || item.text || item.id

        .col-sm-9.col-xs-12

          mixin demo(item)
            - var brief = item.id
            section(id=brief)
              h1= item.text || brief
              - var dir = "docs/demos/"+brief
              - var desc = fs.readFileSync(dir+"/desc.md").toString()
              - var view = fs.readFileSync(dir+"/view.html").toString().trim()
              - var ctrl = fs.readFileSync(dir+"/controller.js").toString().trim()

              // watch change of user to update rootScope for debugging
              - var ctrlDebug = item.nodebug ? ctrl : ctrl.replace(/\}\);$/i, '$scope.$watch("user", function(v) { $scope.$parent.debug["'+brief+'"]=v; }); });')

              h3 demo

              if item.fiddle
                a.btn.btn-info.fiddle.pull-right(href=item.fiddle, target="_blank")
                  = item.fiddleText || 'jsFiddle'

              .well.line-example!= view

              if !item.nodebug
                pre!= '{{ debug["'+brief+'"] | json }}'
              p!= md(desc)
              //script(src=dir+'/controller.js')
              script!= ctrlDebug
              h3 html
              pre.prettyprint.ng-non-bindable= view
              h3 controller.js
              pre.prettyprint= ctrl

          // render
          - for(var i=0; i<structure.length; i++)
            - var g = structure[i]
            - if (g.env !== undefined && g.env !== env) continue;
            if (g.type === 'demos')  
              each item in g.items
                +demo(item)
            if (g.type !== 'demos')
              section(id=g.id)
              h1= g.text
              // jade cannot include dynamically
              if g.id === 'overview'
                include overview.jade
              if g.id === 'getstarted'
                include getstarted.jade
              if g.id === 'themes'
                include themes.jade
              if g.id === 'reference'
                include reference.jade



    footer
      hr
      :markdown
        If you have question or idea please feel free to [open issue on github](https://github.com/vitalets/angular-xeditable/issues).

      p &copy; Vitaliy Potapov 2013. Released under the MIT license.

    if env == 'prod'
      include metrika.html


